<template>
  <div class="layout layout-100" v-if="model">
    <Layout class="layout-100">
      <Header class="header-cont">{{$route.params.name}}</Header>
  <Content class="content-cont">
    <Tabs value="1" v-model="active" @on-click="activeTab">
      <TabPane label="基本信息" name="1"></TabPane>
      <TabPane label="管理范围" name="2"></TabPane>
      <TabPane label="角色权限" name="3"></TabPane>
      <TabPane label="其他身份" v-if="$route.params.type == 'details'" name="4"></TabPane>
    </Tabs>
    <Form
      ref="formData"
      :model="formData"
      label-position="top"
      :show-message="false"
      :hide-required-mark = "$route.params.type == 'details'"
    >
      <Layout class="form-input" v-show="active == 1">
        <Content>
          <Row :gutter="16">
            <Col span="24">
            <FormItem
              label="人员编号"
              prop="basicInfo.number"
              :required="true"

            >
              <Input
                style="width:350px;margin-right:40px;"
                v-model="formData.basicInfo.number"
                maxlength="30"
                :disabled="$route.params.type !== 'add'"
              />
              <Button
                type="primary"
                v-show="$route.params.type === 'add'"
                @click="checkPersonBtn('现有人员调入')"
              >现有人员调入</Button
              >
            </FormItem>
            </Col>
            <Col span="12">
            <FormItem
              label="姓名"
              prop="basicInfo.name"
              :required="true"
            >
              <Input
                style="width:350px;"
                maxlength="20"
                v-model.trim="formData.basicInfo.name"
                :disabled="$route.params.type === 'details'"
              />
            </FormItem>
            </Col>
            <Col span="12">
            <FormItem
              label="身份证号"
              prop="basicInfo.idcard"
              :required="true"
            >
              <Input
                style="width:350px;"
                maxlength="18"
                v-model.trim="formData.basicInfo.idcard"
                :disabled="$route.params.type === 'details'"
              />
            </FormItem>
            </Col>
            <Col span="12">
            <FormItem
              label="联系电话"
              prop="basicInfo.tel"
              :required="true"
            >
              <Input
                style="width:350px;"
                maxlength="11"
                v-model.trim="formData.basicInfo.tel"
                :disabled="$route.params.type === 'details'"
              />
            </FormItem>
            </Col>
            <Col span="12">
            <FormItem
              label="职务"
              prop="basicInfo.postList"
              :required="true"
            >
              <Select
                v-model="formData.basicInfo.postList"
                multiple
                style="width:350px;"
                :disabled="$route.params.type === 'details'"
                placeholder="请选择职务"
              >
                <OptionGroup label="通用">
                  <Option
                    v-for="item in postList.generalPostList"
                    :value="item.id"
                    :key="item.id"
                  >{{ item.name }}</Option
                  >
                </OptionGroup>
                <OptionGroup label="专用">
                  <Option
                    v-for="item in postList.proprietaryPostList"
                    :value="item.id"
                    :key="item.id"
                  >{{ item.name }}</Option
                  >
                </OptionGroup>
              </Select>
            </FormItem>
            </Col>
            <Col span="12">
            <FormItem
              label="工种"
              prop="basicInfo.dictWorkType"
              :required="true"
            >
              <Select
                v-model="formData.basicInfo.dictWorkType"
                style="width:350px;"
                :disabled="$route.params.type === 'details'"
                placeholder="请选择工种"
              >
                <Option
                  v-for="item in professionList"
                  :value="item.code"
                  :key="item.code"
                >{{ item.name }}</Option
                >
              </Select>
            </FormItem>
            </Col>

            <Col span="12">
            <FormItem
              label="入职日期"
              prop="basicInfo.entryTime"
              :required="true"
            >
              <DatePicker
                v-model="formData.basicInfo.entryTime"
                :disabled="$route.params.type === 'details'"
                transfer
                type="date"
                placeholder="请选择入场日期"
                style="width: 350px"
              ></DatePicker>
            </FormItem>
            </Col>
            <Col span="12">
            <FormItem label="应急联系人">
              <Input
                style="width:350px;"
                maxlength="20"
                v-model.trim="formData.basicInfo.emergencyContact"
                :disabled="$route.params.type === 'details'"
              />
            </FormItem>
            </Col>
            <Col span="12">
            <FormItem label="联系人手机">
              <Input
                style="width:350px;"
                maxlength="11"
                v-model.trim="formData.basicInfo.emergencyContactTel"
                :disabled="$route.params.type === 'details'"
              />
            </FormItem>
            </Col>
            <Col span="12">
            <FormItem label="政治面貌">
              <Select
                v-model="formData.basicInfo.dictPoliticalStatus"
                :disabled="$route.params.type === 'details'"
                style="width:350px;"
                placeholder=""
              >
                <Option
                  v-for="item in dictPolitical"
                  :value="item.code"
                  :key="item.code"
                >{{ item.name }}</Option
                >
              </Select>
            </FormItem>
            </Col>
            <Col span="12">
            <FormItem label="宗教信仰">
              <Select
                v-model="formData.basicInfo.dictReligion"
                :disabled="$route.params.type === 'details'"
                transfer
                placeholder=""
                style="width:350px;"
              >
                <Option
                  v-for="item in dictReligion"
                  :value="item.code"
                  :key="item.code"
                >{{ item.name }}</Option
                >
              </Select>
            </FormItem>
            </Col>
          </Row>
          <Row>
            <Col span="4">
            <div>
              <div
                class="demo-upload-list"
                v-for="item in uploadList"
                :key="item.id"
              >
                <template v-if="item.status === 'finished'">
                  <!--<img :src="'https://user.qhse.cn/etcsso/images' + item.filePath ">-->
                  <img
                    :src="
                              fileUploadUrl +
                                '/file/downFile/' +
                                item.response.fileIds
                            "
                    style="width:150px;height:150px;"
                  />
                  <div class="demo-upload-list-cover">
                    <Icon
                      type="ios-eye-outline"
                      @click.native="handleView(1)"
                    ></Icon>
                    <Icon
                      type="ios-trash-outline"
                      v-show="$route.params.type != 'details'"
                      @click.native="handleRemove(1)"
                    ></Icon>
                  </div>
                </template>
                <template v-else>
                  <Progress
                    v-if="item.showProgress"
                    :percent="item.percentage"
                    hide-info
                  ></Progress>
                </template>
              </div>
              <Upload
                ref="upload"
                :show-upload-list="false"
                :default-file-list="defaultList"
                :on-success="handleSuccess"
                :format="['jpg', 'jpeg', 'png']"
                :max-size="2048"
                :on-format-error="handleFormatError"
                :on-exceeded-size="handleMaxSize"
                :action="uploadAction"
                type="drag"
                style="display: inline-block; width:150px;"
                v-show="
                          uploadList.length == 0 &&
                            $route.params.type != 'details'
                        "
              >
                <div class="pic1">
                  <Icon
                    type="ios-cloud-upload"
                    size="52"
                    style="color: #3399ff"
                  ></Icon>
                  <p>点击添加照片</p>
                </div>
                <Modal title="查看图片" v-model="visible" width="50" footer-hide>
                  <img
                    :src="
                              fileUploadUrl +
                                '/file/downFile/' +
                                uploadList[0].response.fileIds
                            "
                    v-if="visible"
                    style="width:100%"
                  />
                </Modal>
              </Upload>
            </div>
            </Col>
            <Col span="6">
            <div>
              <div
                class="demo-upload-list1"
                v-for="item in uploadList1"
                :key="item.id"
              >
                <template v-if="item.status === 'finished'">
                  <!--<img :src="'https://user.qhse.cn/etcsso/images' + item.filePath ">-->
                  <img
                    :src="
                              fileUploadUrl +
                                '/file/downFile/' +
                                item.response.fileIds
                            "
                    style="width:250px;height:150px;"
                  />
                  <div class="demo-upload-list-cover1">
                    <Icon
                      type="ios-eye-outline"
                      @click.native="handleView(2)"
                    ></Icon>
                    <Icon
                      type="ios-trash-outline"
                      v-show="$route.params.type != 'details'"
                      @click.native="handleRemove(2)"
                    ></Icon>
                  </div>
                </template>
                <template v-else>
                  <Progress
                    v-if="item.showProgress"
                    :percent="item.percentage"
                    hide-info
                  ></Progress>
                </template>
              </div>
              <Upload
                ref="upload1"
                :show-upload-list="false"
                :default-file-list="defaultList"
                :on-success="handleSuccess1"
                :format="['jpg', 'jpeg', 'png']"
                :max-size="2048"
                :on-format-error="handleFormatError"
                :on-exceeded-size="handleMaxSize"
                :action="uploadAction"
                type="drag"
                style="display: inline-block; width:250px;"
                v-show="
                          uploadList1.length == 0 &&
                            $route.params.type != 'details'
                        "
              >
                <div class="pic2">
                  <Icon
                    type="ios-cloud-upload"
                    size="52"
                    style="color: #3399ff"
                  ></Icon>
                  <p>身份证正面</p>
                </div>
                <Modal title="查看图片" width="50" v-model="visible1">
                  <img
                    :src="
                              fileUploadUrl +
                                '/file/downFile/' +
                                uploadList1[0].response.fileIds
                            "
                    v-if="visible1"
                    style="width: 100%"
                  />
                </Modal>
              </Upload>
            </div>
            </Col>
            <Col span="14">
            <div>
              <div
                class="demo-upload-list1"
                v-for="item in uploadList2"
                :key="item.id"
              >
                <template v-if="item.status === 'finished'">
                  <!--<img :src="'https://user.qhse.cn/etcsso/images' + item.filePath ">-->
                  <img
                    :src="
                              fileUploadUrl +
                                '/file/downFile/' +
                                item.response.fileIds
                            "
                    style="width:250px;height:150px;"
                  />
                  <div class="demo-upload-list-cover1">
                    <Icon
                      type="ios-eye-outline"
                      @click.native="handleView(3)"
                    ></Icon>
                    <Icon
                      type="ios-trash-outline"
                      v-show="$route.params.type != 'details'"
                      @click.native="handleRemove(3)"
                    ></Icon>
                  </div>
                </template>
                <template v-else>
                  <Progress
                    v-if="item.showProgress"
                    :percent="item.percentage"
                    hide-info
                  ></Progress>
                </template>
              </div>
              <Upload
                ref="upload2"
                :show-upload-list="false"
                :default-file-list="defaultList"
                :on-success="handleSuccess2"
                :format="['jpg', 'jpeg', 'png']"
                :max-size="2048"
                :on-format-error="handleFormatError"
                :on-exceeded-size="handleMaxSize"
                :action="uploadAction"
                type="drag"
                style="display: inline-block; width:250px;"
                v-show="
                          uploadList2.length == 0 &&
                            $route.params.type != 'details'
                        "
              >
                <div class="pic2">
                  <Icon
                    type="ios-cloud-upload"
                    size="52"
                    style="color: #3399ff"
                  ></Icon>
                  <p>身份证背面</p>
                </div>
                <Modal title="查看图片" width="50" v-model="visible2">
                  <img
                    :src="
                              fileUploadUrl +
                                '/file/downFile/' +
                                uploadList2[0].response.fileIds
                            "
                    v-if="visible2"
                    style="width: 100%"
                  />
                </Modal>
              </Upload>
            </div>
            </Col>
          </Row>
        </Content>
      </Layout>
      <div v-show="active == 2">
        <Row>
          <Col span="24">
          <div>
            <Layout>
              <Header class="header-cont">主管部门</Header>
              <Content v-show="$route.params.type != 'details'">
                <CheckboxGroup
                  @on-change="changeMangeDeptList"
                  v-model="mangeDeptIdList"
                >
                  <Checkbox
                    v-for="item in mangeDeptList"
                    :label="item.id"
                    border
                    :disabled="$route.params.type === 'details'"
                  >{{ item.name }}</Checkbox
                  >
                </CheckboxGroup>
              </Content>
              <Content class="content-cont" v-show="$route.params.type == 'details'">
                <div v-for="item in mangeDeptList" style="margin-right:30px;float:left">
                  <Button  disabled type="default" ghost>{{item.name}}</Button>
                </div>
              </Content>
            </Layout>
          </div>
          </Col>
          <Col span="24">
          <div>
            <Layout>
              <Header class="header-cont">关注项目</Header>
              <Content>
                <div class="table-title">
                  <Icon
                    style="float:right;margin-top:8px;"
                    v-show="$route.params.type != 'details'"
                    type="ios-add-circle-outline"
                    size="24"
                    color="#2d8cf0"
                    @click="addTable"
                  />
                </div>
                <Table
                  border
                  :columns="columns"
                  :data="formData.mangeScope.followProjectList"
                >
                  <template slot-scope="{ row, index }" slot="action">
                    <Icon
                      type="ios-remove-circle-outline"
                      @click="remove(index)"
                      v-show="$route.params.type != 'details'"
                      size="24"
                      color="#2d8cf0"
                    />
                  </template>
                </Table>
              </Content>
            </Layout>
          </div>
          </Col>
        </Row>
      </div>
      <div v-show="active == 3">
        <Row>
          <Col span="24">
          <Checkbox
            @on-change="changeUser"
            v-model="formData.rolePerm.autoGenUser"
            v-show="$route.params.type != 'details'"
            :disabled = "checkAuto"
          >自动生成用户</Checkbox>
          </Col>
          <Checkbox
            @on-change="changeUser"
            v-show="$route.params.type == 'details'"
            v-model="formData.rolePerm.autoGenUser"
            disabled
          >自动生成用户</Checkbox>
          </Col>
          <Col span="24">
          <div>
            <Layout>
              <Header class="header-cont" style="background: #F5F8FC">通用角色</Header>
              <Content class="content-cont" v-show="$route.params.type != 'details'">
                <CheckboxGroup
                  @on-change="changeNormalRoleList"
                  v-model="normalRoleIdList"
                >
                  <Checkbox
                    v-for="item in normalRoleList"
                    :key="item.id"
                    :label="item.id"
                    border
                    :disabled="$route.params.type === 'details'"
                  >{{ item.name }}</Checkbox
                  >
                </CheckboxGroup>
              </Content>
              <Content class="content-cont" v-show="$route.params.type == 'details'">
                <div v-for="item in normalRoleList" style="margin-right:30px;float:left">
                  <Button  disabled type="default" ghost>{{item.name}}</Button>
                </div>
              </Content>
            </Layout>
          </div>
          </Col>
          <Col span="24">
          <div>
            <Layout>
              <Header class="header-cont" style="background: #F5F8FC">专用角色</Header>
              <Content class="content-cont" v-show="$route.params.type != 'details'">
                <CheckboxGroup
                  v-model="specialRoleIdList"
                  @on-change="changeSpecialRoleList"
                >
                  <Checkbox
                    v-for="item in specialRoleList"
                    :key="item.id"
                    :label="item.id"
                    border
                    :disabled="$route.params.type === 'details'"
                  >{{ item.name }}</Checkbox
                  >
                </CheckboxGroup>
              </Content>
              <Content class="content-cont" v-show="$route.params.type == 'details'">
                <div v-for="item in specialRoleList" style="margin-right:30px;float:left">
                  <Button  disabled type="default" ghost>{{item.name}}</Button>
                </div>
              </Content>
            </Layout>
          </div>
          </Col>
        </Row>
      </div>
      <div v-show="active == 4">
        <template>
          <div>
            <Table
              border
              :columns="columns1"
              :data="formData.otherIdentity"
            >
              <template slot-scope="{ row, index }" slot="action">
                <Icon
                  type="ios-remove-circle-outline"
                  @click="remove(index)"
                  size="24"
                  color="#2d8cf0"
                />
              </template>
            </Table>
          </div>
        </template>
      </div>
    </Form>
    <div class="footer-cont" v-show="$route.params.type !== 'details'">
      <Button type="primary" @click="saveSubmit('formData')">保存</Button>
      <Button @click="closetab">取消</Button>
    </div>
  </Content>
  </Layout>
  </div>
<manageModal @func="getMsg" v-else-if="!model"></manageModal>
</template>

<script>
  import manageModal from './manageModal.vue'
  import { mapMutations } from 'vuex'
  import Cookies from 'js-cookie'
  export default {
    components: { manageModal },
    name: 'ProjectPersonDetail',
    data() {
      return {
        model: true,
        typeList: [],
        formData: {
          rolePerm: {
            specialRoleList: [],
            normalRoleList: [],
            autoGenUser: true
          },
          qualifications: [],
          basicInfo: {
            number: '',
            entryTime: '',
            idcard: '',
            name: '',
            tel: '',
            postList: [],
            dictWorkType: '',
            checkStatus: ''
          },
          mangeScope: {
            followProjectList: [],
            mangeDeptList: []
          },
          otherIdentity: []
        },
        checkAuto:false,
        joinType: 1,
        specialRoleIdList: [], //选择专业类型ID数组
        normalRoleIdList: [], //选择通用类型ID数组
        active: '1',
        columns: [
          {
            title: '序号',
            align: 'center',
            render: (h, params) => {
              return h('span', params.index + 1)
            }
          },
          {
            title: '项目名称',
            key: 'shortName',
            align: 'center'
          },
          {
            title: '工程类型',
            key: 'dictEngineeringTypeName',
            align: 'center'
          },
          {
            title: '操作',
            slot: 'action',
            width: 150,
            align: 'center'
          }
        ],
        columns1: [
          {
            title: '序号',
            align: 'center',
            width: 50,
            render: (h, params) => {
              return h('span', params.index + 1)
            }
          },
          {
            title: '所属机构',
            key: 'enterpriseShortName',
            align: 'center'
          },
          {
            title: '职务',
            key: 'postNames',
            align: 'center'
          },
          {
            title: '角色',

            key: 'roleNames',
            align: 'center'
          }
        ],
        visible: false,
        visible1: false,
        visible2: false,
        specialRoleList: [], //专用角色
        normalRoleList: [], //通用角色
        uploadAction: process.env.VUE_APP_FILE_SERVER_URL + 'file/uploadFile',
        fileUploadUrl: process.env.VUE_APP_FILE_SERVER_URL,
        defaultList: [], //上传图片
        professionList: [], //工种
        postList: [], //职务类型
        personStatusList: [], //人员状态
        dictPolitical: [], //政治面貌
        dictReligion: [], //宗教信仰
        licenseTypeList: [],
        followProjectList: [],
        mangeDeptList: [],
        mangeDeptIdList: [],
        uploadList: [],
        uploadList1: [],
        uploadList2: []
      }
    },
    methods: {
      ...mapMutations(['closeTag']),
      closetab() {
        /**
         * 如果是调用closeTag方法，普通的页面传入的对象参数只需要写name字段即可
         * 如果是动态路由和带参路由，需要传入query或params字段，用来区别关闭的是参数为多少的页面
         */
        this.closeTag({
          name: this.$route.name,
          params: this.$route.params,
        })
        this.uploadList = []
        this.uploadList1 = []
        this.uploadList2 = []
        this.active = '1'
      },
      checkPersonBtn(name) {
        Cookies.remove('joinUser', '')
        let type = 1
        this.$router.push({
          name: `enterprise-check-person`,
          params:{
            name:'现有人员调入'
          }
        })
      },
      activeTab(code) {
        if(code == 2){
          if(this.$route.params.type == 'details'){
            this.columns.map((item, index) => {
              if(item.title=='操作'){
                this.columns.splice(index, 1)
              }
            })
          }
        }
        this.active = code
      },
      //获取人员编号
      getPersonCode() {
        let deptId = this.$route.params.deptId
        this.$api.ProjectPerson.getPersonCode(deptId).then(res => {
          if (res.code === 200) {
            this.formData.basicInfo.number = res.data
          } else {
            this.$Message.error(res.message)
          }
        })
      },
      //选择现有人员后获取详情
      getPersonDetail() {
        let joinPerson = Cookies.get('joinUser')
        this.joinType = JSON.parse(joinPerson).joinType
        let id = JSON.parse(joinPerson).id
        if (id) {
          this.$api.ProjectPerson.getPersonDetail(id).then(res => {
            if (res.code === 200) {
              this.formData = res.data
              if (this.formData.basicInfo.entryTime) {
                this.formData.basicInfo.entryTime = this.$time(
                  new Date(this.formData.basicInfo.entryTime),
                  'yyyy-MM-dd'
                )
              }
              Cookies.remove('joinUser', {})
            } else {
              this.$Message.error(res.message)
            }
          })
        }
      },
      //获取工种
      getProfessionList() {
        let code = 'PROFESSION'
        this.$api.ProjectPerson.getListByTypeCode(code).then(res => {
          if (res.code === 200) {
            this.professionList = res.data
          } else {
            this.$Message.error(res.message)
          }
        })
      },
      //获取证件类型
      getLicenseType() {
        let code = 'LICENSE_TYPE'
        this.$api.ProjectPerson.getListByTypeCode(code).then(res => {
          if (res.code === 200) {
            this.licenseTypeList = res.data
          } else {
            this.$Message.error(res.message)
          }
        })
      },
      //获取人员状态
      getPersonStatus() {
        let code = 'PERSON_STATE'
        this.$api.ProjectPerson.getListByTypeCode(code).then(res => {
          if (res.code === 200) {
            this.personStatusList = res.data
          } else {
            this.$Message.error(res.message)
          }
        })
      },
      //获取政治面貌
      getDictPolitical() {
        let code = 'POLITICS_STATUS'
        this.$api.ProjectPerson.getListByTypeCode(code).then(res => {
          if (res.code === 200) {
            this.dictPolitical = res.data
          } else {
            this.$Message.error(res.message)
          }
        })
      },
      //获取宗教信仰
      getDictReligion() {
        let code = 'PERSON_RELIGION'
        this.$api.ProjectPerson.getListByTypeCode(code).then(res => {
          if (res.code === 200) {
            this.dictReligion = res.data
          } else {
            this.$Message.error(res.message)
          }
        })
      },
      //选择主管部门
      changeMangeDeptList() {
        this.mangeDeptList.forEach(item => {
          item.selected = false
        })
        this.mangeDeptList.forEach(item => {
          this.mangeDeptIdList.forEach(val => {
            if (item.id == val) {
              item.selected = true
            }
          })
        })
        this.formData.mangeScope.mangeDeptList = this.mangeDeptList
      },
      //获取该部门下项目
      getBasicInfo() {
        if (this.$route.params.deptId) {
          let code = this.$route.params.deptId
          this.$api.ProjectPerson.getBasicInfo(code).then(res => {
            if (res.code === 200) {
              this.specialRoleList = res.data.rolePerm.specialRoleList
              this.normalRoleList = res.data.rolePerm.normalRoleList
              this.followProjectList = res.data.mangeScope.followProjectList //关注项目
              this.mangeDeptList = res.data.mangeScope.mangeDeptList //主管部门
              this.postList.generalPostList = res.data.basicInfo.generalPostList
              this.postList.proprietaryPostList = res.data.basicInfo.proprietaryPostList
            } else {
              this.$Message.error(res.message)
            }
          })
        }
      },
      //自动生成用户
      changeUser(res) {
        if (res) {
          this.formData.rolePerm.autoGenUser = true
        } else {
          this.formData.rolePerm.autoGenUser = false
        }
      },
      getMsg(data) {
        if (data) {
          this.active = '2'
          let have = false

          //从子组件获取项目信息
          this.formData.mangeScope.followProjectList.forEach(item => {
            if (item.id == data.id) {
              have = true
            }
          })

          if (!have) {
            this.formData.mangeScope.followProjectList.push(data)
          }
          this.model = true
        } else {
          this.active = '2'
          this.model = true
        }
      },
      //选择通用角色
      changeNormalRoleList() {
        this.normalRoleList.forEach(item => {
          item.selected = false
        })
        this.normalRoleList.forEach(item => {
          this.normalRoleIdList.forEach(val => {
            if (item.id == val) {
              item.selected = true
            }
          })
        })
        this.formData.rolePerm.normalRoleList = this.normalRoleList
      },
      //选择专业角色
      changeSpecialRoleList() {
        this.specialRoleList.forEach(item => {
          item.selected = false
        })
        this.specialRoleList.forEach(item => {
          this.specialRoleIdList.forEach(val => {
            if (item.id == val) {
              item.selected = true
            }
          })
        })
        this.formData.rolePerm.specialRoleList = this.specialRoleList
      },
      //保存人员
      saveSubmit(name) {
        if (!this.formData.basicInfo.name) {
          this.$Message.warning('名称不能为空')
          return
        }
        if (!this.$regex.nameReg(this.formData.basicInfo.name)) {
          this.$Message.warning('名称格式不正确')
          return
        }
        if (!this.formData.basicInfo.idcard) {
          this.$Message.warning('身份证不能为空')
          return
        }
        if (!this.$regex.idCardRegEx(this.formData.basicInfo.idcard)) {
          this.$Message.warning('身份证格式不正确')
          return
        }
        if (!this.formData.basicInfo.tel) {
          this.$Message.warning('联系电话不能为空')
          return
        }
        if (!this.$regex.telRegEx(this.formData.basicInfo.tel)) {
          this.$Message.warning('联系电话格式不正确')
          return
        }
        if (!this.formData.basicInfo.entryTime) {
          this.$Message.warning('入职日期不能为空')
          return
        }
        if(this.formData.rolePerm.autoGenUser){
          if (
            this.normalRoleIdList.length == 0 &&
            this.specialRoleIdList.length == 0
          ) {
            this.$Message.warning('请勾选角色')
            return
          }
        }else{
          if (
            this.normalRoleIdList.length > 0 ||
            this.specialRoleIdList.length > 0
          ) {
            this.$Message.warning('请勾选自动生成用户')
            return
          }
        }

        if (this.formData.basicInfo.postList.length == 0) {
          this.$Message.warning('职务不能为空')
          return
        }
        if (!this.formData.basicInfo.dictWorkType) {
          this.$Message.warning('工种不能为空')
          return
        }
        let params = JSON.parse(JSON.stringify(this.formData))
        params.basicInfo.postList = []
        this.postList.generalPostList.forEach(val => {
          this.formData.basicInfo.postList.forEach(item => {
            if (item == val.id) {
              val.selected = true
              params.basicInfo.postList.push(val)
            }
          })
        })
        this.postList.proprietaryPostList.forEach(val => {
          this.formData.basicInfo.postList.forEach(item => {
            if (item == val.id) {
              val.selected = true
              params.basicInfo.postList.push(val)
            }
          })
        })
        if (this.formData.rolePerm.autoGenUser) {
          params.rolePerm.autoGenUser = 1
        } else {
          params.rolePerm.autoGenUser = 0
        }
        params.deptId = this.$route.params.deptId
        params.type = this.joinType
        if (this.$route.params.type === 'editor') {
          params.id = this.$route.params.id
          this.$api.ProjectPerson.editEnterprisePerson(params).then(res => {
            if (res.code === 200) {
              this.$Message.success(res.message)
              this.closetab()
              this.$router.push({
                path: '/organization/enterprise-person'
              })
              localStorage.setItem('page', JSON.stringify(this.page))
            } else {
              this.$Message.error(res.message)
            }
          })
        } else {
          this.$api.ProjectPerson.addEnterprisePerson(params).then(res => {
            if (res.code === 200) {
              this.$Message.success(res.message)
              this.closetab()
              this.$router.push({
                path: '/organization/enterprise-person'
              })
              localStorage.setItem('page', JSON.stringify(this.page))
            } else {
              this.$Message.error(res.message)
            }
          })
        }
      },
      //详情
      getDetail(id) {
        if (this.$route.params.name === '日志详情') {
          this.$api.operationLog.getOperationLogDetail(id).then(res => {
            if (res.code === 200) {
              let data = JSON.parse(res.data.params)
              this.formData = data
              this.postList.generalPostList = this.formData.basicInfo.postList
              let postIdList = []
              this.formData.basicInfo.postList.forEach(item => {
                if (item.selected) {
                  postIdList.push(item.id)
                }
              })
              this.formData.basicInfo.postList = postIdList
              if (this.formData.basicInfo.entryTime) {
                this.formData.basicInfo.entryTime = this.$time(
                  new Date(this.formData.basicInfo.entryTime),
                  'yyyy-MM-dd'
                )
              }
              if (this.formData.rolePerm.autoGenUser == 0) {
                this.formData.rolePerm.autoGenUser = false
              } else if (this.formData.rolePerm.autoGenUser == 1) {
                this.formData.rolePerm.autoGenUser = true
                this.checkAuto = true
              }
              if (this.formData.basicInfo.avatar) {
                let upload = [
                  {
                    status: 'finished',
                    showProgress: false,
                    response: {
                      fileIds: this.formData.basicInfo.avatar
                    }
                  }
                ]
                this.uploadList = upload
              }
              if (this.formData.basicInfo.idFrontPhoto) {
                let upload1 = [
                  {
                    status: 'finished',
                    showProgress: false,
                    response: {
                      fileIds: this.formData.basicInfo.idFrontPhoto
                    }
                  }
                ]
                this.uploadList1 = upload1
              }
              if (this.formData.basicInfo.idReversePhoto) {
                let upload2 = [
                  {
                    status: 'finished',
                    showProgress: false,
                    response: {
                      fileIds: this.formData.basicInfo.idReversePhoto
                    }
                  }
                ]
                this.uploadList2 = upload2
              }
              this.specialRoleIdList = []
              this.normalRoleIdList = []
              this.mangeDeptList = []
              this.formData.rolePerm.specialRoleList.forEach(item => {
                if (item.selected == true) {
                  if(this.$route.params.type === 'details'){
                    this.specialRoleList.push(item);
                  }
                  this.specialRoleIdList.push(item.id)
                }
              })
              if(this.$route.params.type !== 'details'){
                this.specialRoleList = this.formData.rolePerm.specialRoleList
                this.normalRoleList = this.formData.rolePerm.normalRoleList
                this.mangeDeptList = this.formData.mangeScope.mangeDeptList
              }
              this.formData.rolePerm.normalRoleList.forEach(item => {
                if (item.selected == true) {
                  if(this.$route.params.type === 'details'){
                    this.normalRoleList.push(item);
                  }
                  this.normalRoleIdList.push(item.id)
                }
              })
              if (this.formData.qualifications.length > 0) {
                this.formData.qualifications.forEach(item => {
                  item.expiredTime = this.$time(
                    new Date(item.expiredTime),
                    'yyyy-MM-dd'
                  )
                })
              }
              this.formData.mangeScope.mangeDeptList.forEach(item => {
                if (item.selected == true) {
                  if(this.$route.params.type === 'details'){
                    this.mangeDeptList.push(item);
                  }
                  this.mangeDeptIdList.push(item.id)
                }
              })

            } else {
              this.$Message.error(res.message)
            }
          })
        } else {
          this.$api.ProjectPerson.getPersonDetail(id).then(res => {
            if (res.code === 200) {
              this.formData = res.data
              let postIdList = []
              this.formData.basicInfo.postList.forEach(item => {
                if (item.selected) {
                  postIdList.push(item.id)
                }
              })
              this.formData.basicInfo.postList = postIdList
              this.postList.generalPostList = this.formData.basicInfo.generalPostList
              this.postList.proprietaryPostList = this.formData.basicInfo.proprietaryPostList
              if (this.formData.basicInfo.entryTime) {
                this.formData.basicInfo.entryTime = this.$time(
                  new Date(this.formData.basicInfo.entryTime),
                  'yyyy-MM-dd'
                )
              }
              if (this.formData.rolePerm.autoGenUser == 0) {
                this.formData.rolePerm.autoGenUser = false
              } else if (this.formData.rolePerm.autoGenUser == 1) {
                this.formData.rolePerm.autoGenUser = true
                this.checkAuto = true
              }
              if (this.formData.basicInfo.avatar) {
                let upload = [
                  {
                    status: 'finished',
                    showProgress: false,
                    response: {
                      fileIds: this.formData.basicInfo.avatar
                    }
                  }
                ]
                this.uploadList = upload
              }
              if (this.formData.basicInfo.idFrontPhoto) {
                let upload1 = [
                  {
                    status: 'finished',
                    showProgress: false,
                    response: {
                      fileIds: this.formData.basicInfo.idFrontPhoto
                    }
                  }
                ]
                this.uploadList1 = upload1
              }
              if (this.formData.basicInfo.idReversePhoto) {
                let upload2 = [
                  {
                    status: 'finished',
                    showProgress: false,
                    response: {
                      fileIds: this.formData.basicInfo.idReversePhoto
                    }
                  }
                ]
                this.uploadList2 = upload2
              }
              this.specialRoleIdList = []
              this.normalRoleIdList = []
              this.specialRoleList = []
              this.normalRoleList = []
              this.mangeDeptList = []
              if(this.$route.params.type !== 'details'){
                this.specialRoleList = this.formData.rolePerm.specialRoleList
                this.normalRoleList = this.formData.rolePerm.normalRoleList
                this.mangeDeptList = this.formData.mangeScope.mangeDeptList
              }
              this.formData.rolePerm.specialRoleList.forEach(item => {
                if (item.selected == true) {
                  if(this.$route.params.type === 'details'){
                    this.specialRoleList.push(item);
                  }
                  this.specialRoleIdList.push(item.id)
                }
              })
              this.formData.rolePerm.normalRoleList.forEach(item => {
                if (item.selected == true) {
                  if(this.$route.params.type === 'details'){
                    this.normalRoleList.push(item);
                  }
                  this.normalRoleIdList.push(item.id)
                }
              })
              if (this.formData.qualifications.length > 0) {
                this.formData.qualifications.forEach(item => {
                  item.expiredTime = this.$time(
                    new Date(item.expiredTime),
                    'yyyy-MM-dd'
                  )
                })
              }
              this.formData.mangeScope.mangeDeptList.forEach(item => {
                if (item.selected == true) {
                  if(this.$route.params.type === 'details'){
                    this.mangeDeptList.push(item);
                  }
                  this.mangeDeptIdList.push(item.id)
                }
              })
              Cookies.remove('joinUser', {})
            }
          })
        }
      },
      //详情
      getNewDetail() {
        let joinPerson = JSON.parse(localStorage.getItem('joinUser'))
        this.joinType = joinPerson.joinType
        let id = joinPerson.id
        let deptId = this.$route.params.deptId
        this.$api.ProjectPerson.getNewDetail(deptId, id).then(res => {
          if (res.code === 200) {
            localStorage.setItem('joinUser', '')
            this.formData = res.data
            let postIdList = []
            this.formData.basicInfo.postList.forEach(item => {
              if (item.selected) {
                postIdList.push(item.id)
              }
            })
            this.formData.basicInfo.postList = postIdList
            this.postList.generalPostList = this.formData.basicInfo.generalPostList
            this.postList.proprietaryPostList = this.formData.basicInfo.proprietaryPostList
            if (this.formData.basicInfo.entryTime) {
              this.formData.basicInfo.entryTime = this.$time(
                new Date(this.formData.basicInfo.entryTime),
                'yyyy-MM-dd'
              )
            }
            if (this.formData.rolePerm.autoGenUser == 0) {
              this.formData.rolePerm.autoGenUser = false
            } else if (this.formData.rolePerm.autoGenUser == 1) {
              this.formData.rolePerm.autoGenUser = true
            }

            if (this.formData.basicInfo.avatar) {
              let upload = [
                {
                  status: 'finished',
                  showProgress: false,
                  response: {
                    fileIds: this.formData.basicInfo.avatar
                  }
                }
              ]
              this.uploadList = upload
            }
            if (this.formData.basicInfo.idFrontPhoto) {
              let upload1 = [
                {
                  status: 'finished',
                  showProgress: false,
                  response: {
                    fileIds: this.formData.basicInfo.idFrontPhoto
                  }
                }
              ]
              this.uploadList1 = upload1
            }
            if (this.formData.basicInfo.idReversePhoto) {
              let upload2 = [
                {
                  status: 'finished',
                  showProgress: false,
                  response: {
                    fileIds: this.formData.basicInfo.idReversePhoto
                  }
                }
              ]
              this.uploadList2 = upload2
            }
            this.specialRoleIdList = []
            this.normalRoleIdList = []
            this.formData.rolePerm.specialRoleList.forEach(item => {
              if (item.selected == true) {
                this.specialRoleIdList.push(item.id)
              }
            })
            this.specialRoleList = this.formData.rolePerm.specialRoleList
            this.formData.rolePerm.normalRoleList.forEach(item => {
              if (item.selected == true) {
                this.normalRoleIdList.push(item.id)
              }
            })
            this.normalRoleList = this.formData.rolePerm.normalRoleList
            if (this.formData.qualifications.length > 0) {
              this.formData.qualifications.forEach(item => {
                item.expiredTime = this.$time(
                  new Date(item.expiredTime),
                  'yyyy-MM-dd'
                )
              })
            }
            this.formData.mangeScope.mangeDeptList.forEach(item => {
              if (item.selected == true) {
                this.mangeDeptIdList.push(item.id)
              }
            })
            this.mangeDeptList = this.formData.mangeScope.mangeDeptList
          } else {
            this.$Message.error(res.message)
          }
        })
      },
      //关注项目添加
      addTable() {
        this.model = false
        this.model1 = true
      },
      remove(row) {
        this.formData.mangeScope.followProjectList.splice(row, 1)
      },
      /*上传图片开始.....................................*/

      handleView(code) {
        //查看
        if (code == 1) {
          this.visible = true
        } else if (code == 2) {
          this.visible1 = true
        } else {
          this.visible2 = true
        }
      },
      handleRemove(code) {
        //删除
        if (code == 1) {
          this.uploadList = []
          this.$refs.upload.fileList = []
          this.formData.basicInfo.avatar = '';
        } else if (code == 2) {
          this.uploadList1 = []
          this.$refs.upload1.fileList = []
          this.formData.basicInfo.idFrontPhoto = '';
        } else if (code == 3) {
          this.uploadList2 = []
          this.$refs.upload2.fileList = []
          this.formData.basicInfo.idReversePhoto = '';
        }
      },
      handleSuccess(res, file) {
        //上传成功
        this.uploadList = this.$refs.upload.fileList
        this.formData.basicInfo.avatar = file.response.fileIds
      },
      handleSuccess1(res, file) {
        //上传成功
        this.uploadList1 = this.$refs.upload1.fileList
        this.formData.basicInfo.idFrontPhoto = file.response.fileIds
      },
      handleSuccess2(res, file) {
        //上传成功
        this.uploadList2 = this.$refs.upload2.fileList
        this.formData.basicInfo.idReversePhoto = file.response.fileIds
      },
      handleFormatError(file) {
        //文件格式
        this.$Notice.warning({
          title: '温馨提示',
          desc: '文件' + file.name + ' 格式不正确,请上传jpg,jpeg, png格式的'
        })
      },
      handleMaxSize(file) {
        //文件大小目前2m
        this.$Notice.warning({
          title: '温馨提示',
          desc: '文件' + file.name + ' 大小不能大于2M.'
        })
      },
      /*上传图片结束.....................................*/

      //上传证件信息
      hanleUploadSuc(res, file, fileList, params) {
        this.formData.qualifications[params.index].fileName = res.fileNames
        this.formData.qualifications[params.index].attachment = res.fileIds
      },

    },
    mounted() {

      this.getProfessionList()
      this.getPersonStatus()
      this.getLicenseType()
      this.getDictPolitical()
      this.getDictReligion()
      this.getBasicInfo()
      if (
        this.$route.params.type === 'editor' ||
        this.$route.params.type === 'details'
      ) {
        this.getDetail(this.$route.params.id)
      } else {
        if (localStorage.getItem('joinUser')) {

          this.getNewDetail()
        } else {
          this.getPersonCode()
        }
      }
      this.uploadList = this.$refs.upload.fileList
      this.uploadList1 = this.$refs.upload1.fileList
      this.uploadList2 = this.$refs.upload2.fileList
    },
    activated(){
      if (localStorage.getItem('joinUser')){
        this.getNewDetail()
      }
    }
  }
</script>

<style lang="scss" scoped>
  .Img-class {
    background-color: transparent;
  }
  .form-input {
    padding: 20px;
    background-color: #ffffff;
  }
  .pic1 {
    width: 150px;
    height: 150px;
    border-radius: 5px;
    padding-top: 20%;
  }
  .pic2 {
    width: 250px;
    height: 150px;
    border-radius: 5px;
    margin-left: 20px;
    padding-top: 15%;
    padding-right: 40px;
  }
  .table-title {
    height: 50px;
    line-height: 50px;
    border: 1px solid #dcdee2;
    border-bottom: none;
    padding: 0 10px;
  }
  .demo-upload-list {
    display: inline-block;
    width: 150px;
    height: 150px;
    text-align: center;
    line-height: 150px;
    border: 1px solid transparent;
    border-radius: 5px;
    overflow: hidden;
    background: #fff;
    position: relative;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
    margin-right: 4px;
  }
  .demo-upload-list-cover {
    display: none;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.6);
  }
  .demo-upload-list:hover .demo-upload-list-cover {
    display: block;
  }
  .demo-upload-list-cover i {
    color: #fff;
    font-size: 20px;
    cursor: pointer;
    margin: 0 2px;
  }
  .demo-upload-list1 {
    display: inline-block;
    width: 250px;
    height: 150px;
    text-align: center;
    line-height: 150px;
    border: 1px solid transparent;
    border-radius: 5px;
    overflow: hidden;
    background: #fff;
    position: relative;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
    margin-right: 4px;
  }
  .demo-upload-list-cover1 {
    display: none;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.6);
  }
  .demo-upload-list1:hover .demo-upload-list-cover1 {
    display: block;
  }
  .demo-upload-list-cover1 i {
    color: #fff;
    font-size: 20px;
    cursor: pointer;
    margin: 0 2px;
  }
</style>